<template>
  <div class="app-container checked">
    <div class="filter-container">
      <el-input v-model="query.query.partnerName" placeholder="请输入供应商名称" clearable @keyup.enter.native="search" />
      <el-date-picker v-model="q_p_formDate1" format="yyyy-MM-dd" value-format="yyyy-MM-dd" type="daterange"
        range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" @change="q_p_selectTimecreate" />
      <el-button type="primary" icon="el-icon-search" @click="search">{{ $t('table.search') }}</el-button>
      <el-button @click="handleExport(1)" type="primary" icon="el-icon-download">
        供应商供货汇总导出
      </el-button>
      <el-button @click="handleExport(2)" type="primary" icon="el-icon-download">
        供应商供货明细导出
      </el-button>
      <el-button @click="handleExport(3)" type="primary" icon="el-icon-download">
        货品采购汇总导出
      </el-button>
      <el-button @click="handleExport(4)" type="primary" icon="el-icon-download">
        货品采购明细导出
      </el-button>
    </div>
    <el-table :data="tableData" highlight-current-row border @selection-change="handleSelectionChange"
      :header-cell-style="{ 'text-align': 'center' }" :cell-style="{ 'text-align': 'center' }">
      <el-table-column prop="orderType" label="单据类型" />
      <el-table-column prop="billingDate" label="开单日期">
        <template slot-scope="{ row: { billingDate } }">
          {{ getMoment(billingDate) }}
        </template>
      </el-table-column>
      <el-table-column label="单据编号" prop="orderNumber" />
      <el-table-column prop="supplierCode" label="供应商编号" />
      <el-table-column prop="supplierName" label="供应商名称" />
      <el-table-column prop="productCode" label="货品编码" />
      <el-table-column prop="productName" label="货品名称" />
      <el-table-column prop="unit" label="单位" />
      <el-table-column prop="originalPrice" label="原始单价" />
      <el-table-column prop="discountRate" label="折扣率(%)" />
      <el-table-column prop="unitPrice" label="单价（折后）" />
      <el-table-column prop="quantity" label="数量" />
      <el-table-column prop="taxRate" label="税率" />
      <el-table-column prop="purchasePayment" label="进货货款" />
      <el-table-column prop="inputTax" label="进项税额" />
      <el-table-column prop="totalAmountIncludingTax" label="价税合计" />
      <el-table-column prop="allocatedCosts" label="已分摊费用" />
    </el-table>
    <pagination v-show="total > 0" :total="total" :page.sync="query.pageIndex" :limit.sync="query.pageSize"
      @pagination="getInfo" />
  </div>
</template>
<script>
import { reportList, supplierPurchaseSummaryExcel, supplierPurchaseDetailExcel, productPurchaseSummaryExcel, productPurchaseDetailExcel } from '@/api/reporting'
import waves from '@/directive/waves' // waves directive
import Pagination from '@/components/Pagination' // secondary package based on el-pagination
import { downfile } from '@/utils'
import moment from "moment";

export default {
  name: 'Productionplan',
  components: { Pagination },
  directives: { waves },
  data() {
    return {
      q_p_formDate1: [],
      total: 0,
      query: {
        pageSize: 10,
        pageIndex: 1,
        query: {
          startDate: "",
          endDate: ""
        }
      },
      tableData: [],
    }
  },
  mounted() {
    this.getInfo()
    this.q_p_formDate1 = [this.query.query.startDate, this.query.query.startDate]
  },
  methods: {
    q_p_selectTimecreate(val){
      if(val){
        this.query.query.startDate = val[0]
        this.query.query.endDate = val[1]
      }else{
        this.query.query.startDate = ''
        this.query.query.endDate = ''
      }
    },
    getMoment(day) {
      if (!day) return "";
      return moment(day).format("YYYY-MM-DD");
    },
    async getInfo() {
      const { records, total } = await reportList(this.query)
      this.tableData = records
      this.total = total
    },
    search() {
      this.query.pageIndex = 1
      this.getInfo()
    },
    async handleExport(val) {
      switch (val) {
        case 1:
          try {
            await supplierPurchaseSummaryExcel(this.query.query)
          } catch (err) {
            const reader = new FileReader();
            reader.readAsText(err);
            reader.onload = (event) => {
              const resultString = reader.result; // 这里就是转换后的字符串
              if (resultString.includes('code') && resultString.includes('isSuccess')) {
                this.$message.error(JSON.parse(resultString).message)
              } else {
                downfile("供应商供货汇总.xlsx", err);
              }
            }
          }
          break;
        case 2:
          try {
            await supplierPurchaseDetailExcel(this.query.query)
          } catch (err) {
            const reader = new FileReader();
            reader.readAsText(err);
            reader.onload = (event) => {
              const resultString = reader.result; // 这里就是转换后的字符串
              if (resultString.includes('code') && resultString.includes('isSuccess')) {
                this.$message.error(JSON.parse(resultString).message)
              } else {
                downfile("供应商供货明细.xlsx", err);
              }
            }
          }
          break;
        case 3:
          try {
            await productPurchaseSummaryExcel(this.query.query)
          } catch (err) {
            const reader = new FileReader();
            reader.readAsText(err);
            reader.onload = (event) => {
              const resultString = reader.result; // 这里就是转换后的字符串
              if (resultString.includes('code') && resultString.includes('isSuccess')) {
                this.$message.error(JSON.parse(resultString).message)
              } else {
                downfile("货品采购汇总.xlsx", err);
              }
            }
          }
          break;
        case 4:
          try {
            await productPurchaseDetailExcel(this.query.query)
          } catch (err) {
            const reader = new FileReader();
            reader.readAsText(err);
            reader.onload = (event) => {
              const resultString = reader.result; // 这里就是转换后的字符串
              if (resultString.includes('code') && resultString.includes('isSuccess')) {
                this.$message.error(JSON.parse(resultString).message)
              } else {
                downfile("货品采购明细.xlsx", err);
              }
            }
          }
          break;
        default:
          break;
      }
    }
  }
}
</script>